<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>新闻后台管理模板</title>
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
    <meta name="description" content="Developed By M Abdur Rokib Promy">
    <meta name="keywords" content="Admin, Bootstrap 3, Template, Theme, Responsive">
    <!-- bootstrap 3.0.2 -->
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <!-- font Awesome -->
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <!-- Ionicons -->
    <link href="css/ionicons.min.css" rel="stylesheet" type="text/css" />
    <!-- Morris chart -->
    <link href="css/morris/morris.css" rel="stylesheet" type="text/css" />
    <!-- jvectormap -->
    <link href="css/jvectormap/jquery-jvectormap-1.2.2.css" rel="stylesheet" type="text/css" />
    <!-- Date Picker -->
    <link href="css/datepicker/datepicker3.css" rel="stylesheet" type="text/css" />
    <!-- fullCalendar -->
    <!-- <link href="css/fullcalendar/fullcalendar.css" rel="stylesheet" type="text/css" /> -->
    <!-- Daterange picker -->
    <link href="css/daterangepicker/daterangepicker-bs3.css" rel="stylesheet" type="text/css" />
    <!-- iCheck for checkboxes and radio inputs -->
    <link href="css/iCheck/all.css" rel="stylesheet" type="text/css" />
    <!-- bootstrap wysihtml5 - text editor -->
    <!-- <link href="css/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css" rel="stylesheet" type="text/css" /> -->
    <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
    <!-- Theme style -->
    <link href="css/style.css" rel="stylesheet" type="text/css" />
</head>

<body class="skin-black">
    <!-- header logo: style can be found in header.less -->
    <header class="header">
        <a href="index.html" class="logo">
                首页
            </a>
        <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top" role="navigation">
            <!-- Sidebar toggle button-->
            <a href="#" class="navbar-btn sidebar-toggle" data-toggle="offcanvas" role="button">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>
            <div class="navbar-right">
                <ul class="nav navbar-nav">
                    <!-- User Account: style can be found in dropdown.less -->
                    <li class="dropdown user user-menu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" id="userTwo">

                        </a>
                        <ul class="dropdown-menu dropdown-custom dropdown-menu-right">
                            <li class="dropdown-header text-center">Account</li>
                            <li class="divider"></li>
                            <li>
                                <span id="logout"><i class="fa fa-ban fa-fw pull-right"></i>Logout</span>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </nav>
    </header>
    <div class="wrapper row-offcanvas row-offcanvas-left">
        <!-- Left side column. contains the logo and sidebar -->

        <aside class="right-side">
            <!-- Main content -->
            <section class="content">
                <!-- Main row -->

                <div class="panel panel-default">
                    <!-- Default panel contents -->
                    <div class="panel-heading">
                        <h4>新闻管理</h4>
                    </div>
                    <div>
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="请输入新闻标题进行查询。。" id="target">
                            <span class="input-group-btn">
                          <button class="btn btn-default" type="button" id="test">Go!</button>
                        </span>
                        </div>
                    </div>
                    <div class="divider">

                    </div>
                    <!-- Table -->
                    <div id="userData">
                        <!--在这里显示-->
                    </div>
                </div>
                <!-- row end -->
            </section>
            <!-- /.content -->
            <div class="footer-main">
                Copyright &copy GaoLainan, 2020
            </div>
        </aside>
        <!-- /.right-side -->

    </div>
    <!-- ./wrapper -->


    <!-- jQuery 2.0.2 -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
    <script src="js/jquery.min.js" type="text/javascript"></script>

    <!-- jQuery UI 1.10.3 -->
    <script src="js/jquery-ui-1.10.3.min.js" type="text/javascript"></script>
    <!-- Bootstrap -->
    <script src="js/bootstrap.min.js" type="text/javascript"></script>
    <!-- daterangepicker -->
    <script src="js/plugins/daterangepicker/daterangepicker.js" type="text/javascript"></script>

    <script src="js/plugins/chart.js" type="text/javascript"></script>

    <!-- datepicker
        <script src="js/plugins/datepicker/bootstrap-datepicker.js" type="text/javascript"></script>-->
    <!-- Bootstrap WYSIHTML5
        <script src="js/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>-->
    <!-- iCheck -->
    <script src="js/plugins/iCheck/icheck.min.js" type="text/javascript"></script>
    <!-- calendar -->
    <script src="js/plugins/fullcalendar/fullcalendar.js" type="text/javascript"></script>

    <!-- Director App -->
    <script src="js/Director/app.js" type="text/javascript"></script>

    <!-- Director dashboard demo (This is only for demo purposes) -->
    <script src="js/Director/dashboard.js" type="text/javascript"></script>


    <script>
        var res = []
        var chooseIndex = ''
        var status = '已通过'

        window.onload = function() {




            if (sessionStorage.getItem("userId") == null) {
                alert("请登录！")
                window.location.href = 'login.html'
            }

            if (sessionStorage.getItem("role") != 1) {
                alert("您的权限不够！")
                window.location.href = 'login.html'
            }

            $.ajax({
                type: "POST",
                url: "http://localhost:8080/manager/query",
                data: {
                    id: sessionStorage.getItem("userId")
                },
                dataType: "json",
                success: function(data) {
                    console.log(data)
                    if (data == null) {
                        alert("请登录")
                        window.location.href = "login.html"
                            //windIdow.navigate("login.html")
                        return;
                    }

                    var div2 = document.getElementById("userOne")
                    var code = '<p>Hello, ' + data.username + '</p>'
                    div2.innerHTML = code

                    var div3 = document.getElementById("userTwo")
                    var cod = '<i class="fa fa-user"></i><span>' + data.username + '<i class="caret"></i></span>'
                    div3.innerHTML = cod

                    console.log(data)
                },
                fail: function() {
                    alert("系统繁忙")
                }
            });

            $.ajax({
                type: "POST",
                url: "http://localhost:8080/news/queryAll",
                data: {

                },
                dataType: "json",
                success: function(data) {
                    res = data
                    console.log(data)
                    var div1 = document.getElementById('userData');
                    var code = '<TABLE class="table">';
                    code += '<tr><td>新闻标题</td><td>新闻内容</td><td>发布人员</td><td>创建时间</td><td>状态</td><td>操作</td></tr>'
                    for (var i = 0; i < data.length; i++) {
                        if (data[i].publishTime == null)
                            status = '未审核'
                        code += '<tr onclick="displayResult(this)"><td>' + data[i].title + '</td><td>' + data[i].content + '</td><td>' + data[i].authorId + '</td><td>2020-10-30 18:30:00</td><td>' + status + '</td><td><div class="btn-group btn-group-xs" role="group" aria-label="..."><button type="button" class="btn btn-default" onclick="set()">通过</button><button type="button" class="btn btn-default" onclick="del()">删除</button></div></td></tr>'
                        console.log(data[i].username)
                    }
                    div1.innerHTML = code + '</TABLE>';
                }
            });
        }

        // 查询的请求
        $("#test").click(function() {
            console.log("this is the button go")
            console.log($("#target").val())
            $.ajax({
                type: "POST",
                url: "http://localhost:8080/news/search",
                data: {
                    title: $("#target").val()
                },
                dataType: "json",
                success: function(data) {
                    res = data
                    console.log(data)
                    console.log(data.length)
                    var div1 = document.getElementById('userData');
                    var code = '<TABLE class="table">';
                    code += '<tr><td>新闻标题</td><td>新闻内容</td><td>发布人员</td><td>创建时间</td><td>状态</td><td>操作</td></tr>'
                    for (var i = 0; i < data.length; i++) {
                        if (data[i].publishTime == null)
                            status = '未审核'
                        code += '<tr onclick="displayResult(this)"><td>' + data[i].title + '</td><td>' + data[i].content + '</td><td>' + data[i].authorId + '</td><td>2020-10-30 18:30:00</td><td>' + status + '</td><td><div class="btn-group btn-group-xs" role="group" aria-label="..."><button type="button" class="btn btn-default" onclick="set()">通过</button><button type="button" class="btn btn-default" onclick="del()">删除</button></div></td></tr>'
                            //console.log(data[i].username)
                    }
                    div1.innerHTML = code + '</TABLE>';
                }

            });
        })


        function del() {
            $.ajax({
                type: "POST",
                url: "http://localhost:8080/news/del",
                data: {
                    id: chooseIndex
                },
                dataType: "json",
                success: function(data) {
                    if (data)
                        alert("删除成功！")
                    window.location.href = 'news.html'

                }

            });
        }

        function set() {
            $.ajax({
                type: "POST",
                url: "http://localhost:8080/news/judge",
                data: {
                    id: chooseIndex
                },
                dataType: "json",
                success: function(data) {
                    if (data)
                        alert("设置成功！")
                    window.location.href = 'news.html'
                }
            });
        }

        function displayResult(x) {
            //alert("Row index is: " + x.rowIndex);
            //console.log(res[x.rowIndex].id)
            // 选定是哪一行
            chooseIndex = res[x.rowIndex - 1].id
            console.log(chooseIndex)
        }

        $("#logout").click(function() {
            alert("退出成功！")
            sessionStorage.removeItem("userId")
            sessionStorage.removeItem("role")
            window.location.href = "login.html"
        })
    </script>


    <!-- Director for demo purposes -->
    <script type="text/javascript">
        $('input').on('ifChecked', function(event) {
            // var element = $(this).parent().find('input:checkbox:first');
            // element.parent().parent().parent().addClass('highlight');
            $(this).parents('li').addClass("task-done");
            console.log('ok');
        });
        $('input').on('ifUnchecked', function(event) {
            // var element = $(this).parent().find('input:checkbox:first');
            // element.parent().parent().parent().removeClass('highlight');
            $(this).parents('li').removeClass("task-done");
            console.log('not');
        });
    </script>
    <script>
        $('#noti-box').slimScroll({
            height: '400px',
            size: '5px',
            BorderRadius: '5px'
        });

        $('input[type="checkbox"].flat-grey, input[type="radio"].flat-grey').iCheck({
            checkboxClass: 'icheckbox_flat-grey',
            radioClass: 'iradio_flat-grey'
        });
    </script>
    <script type="text/javascript">
        $(function() {
            "use strict";
            //BAR CHART
            var data = {
                labels: ["January", "February", "March", "April", "May", "June", "July"],
                datasets: [{
                    label: "My First dataset",
                    fillColor: "rgba(220,220,220,0.2)",
                    strokeColor: "rgba(220,220,220,1)",
                    pointColor: "rgba(220,220,220,1)",
                    pointStrokeColor: "#fff",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "rgba(220,220,220,1)",
                    data: [65, 59, 80, 81, 56, 55, 40]
                }, {
                    label: "My Second dataset",
                    fillColor: "rgba(151,187,205,0.2)",
                    strokeColor: "rgba(151,187,205,1)",
                    pointColor: "rgba(151,187,205,1)",
                    pointStrokeColor: "#fff",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "rgba(151,187,205,1)",
                    data: [28, 48, 40, 19, 86, 27, 90]
                }]
            };
            new Chart(document.getElementById("linechart").getContext("2d")).Line(data, {
                responsive: true,
                maintainAspectRatio: false,
            });

        });
        // Chart.defaults.global.responsive = true;
    </script>
</body>

</html>